<template>
  <view class="more-functions">
    <view class="uni-nav-bar">更多功能</view>

    <view class="function-list">
      <view class="function-item">
        <view class="item-icon icon-role"></view>
        <view class="item-text">角色切换</view>
        <view class="item-arrow"></view>
      </view>
      <view class="function-item">
        <view class="item-icon icon-approval"></view>
        <view class="item-text">信息采集计划审批记录</view>
        <view class="item-arrow"></view>
      </view>
      <view class="function-item">
        <view class="item-icon icon-update"></view>
        <view class="item-text">自主更新审批记录</view>
        <view class="item-arrow">

        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  }
};
</script>

<style scoped>
/* 样式与 RoleSwitch.vue 功能列表部分一致，可复用 */
.more-functions {
  padding: 20rpx;
  background-color: #f5f5f5;
  min-height: 100vh;
}
.uni-nav-bar {
  font-size: 32rpx;
  font-weight: bold;
  margin-bottom: 20rpx;
}
.function-list {
  gap: 12rpx;
  display: flex;
  flex-direction: column;
}
.function-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24rpx;
  background-color: #fff;
  border-radius: 12rpx;
  box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.05);
}
.item-icon {
  width: 48rpx;
  height: 48rpx;
  border-radius: 50%;
  color: #fff;
  text-align: center;
  line-height: 48rpx;
  font-size: 24rpx;
  margin-right: 20rpx;
}
.icon-role {
  background-color: #3498db;
}
.icon-approval {
  background-color: #f39c12;
}
.icon-update {
  background-color: #2ecc71;
}
.item-text {
  flex: 1;
  font-size: 28rpx;
}
.item-arrow {
  width: 24rpx;
  height: 24rpx;
  border-top: 4rpx solid #999;
  border-right: 4rpx solid #999;
  transform: rotate(45deg);
}
</style>